<style>
    .tools-btn { padding: 5px 7px; border-radius: 12px; }

    
    .send-item-list li, .send-pet-list li { margin: 8px 0; }
    .send-item-list li .form-control, .send-pet-list li .form-control { margin-right: 2px; }
    
</style>
<form method="post" action="/oss/?r=packetNum/doAdd">
    <{include file='../common_params.tpl'}>

    <div class="box box-black">
        <div class="box-body">
            <table class="table table-bordered">
                <colgroup>
                    <col style="width: 20%;"></col>
                    <col style="width: 80%;"></col>
                </colgroup>

                <tr>
                    <th class="th-label">服务器</th>
                    <td>
                        <select class="form-control" name="server">
                            <{html_options options=$serverList selected=$server}>
                        </select>
                    </td>
                </tr>
                
                <tr class="type-info" for="1">
                    <th class="th-label">角色名称</th>
                    <td>
                        <textarea class="form-control" rows="5" name="rolename" placeholder="多个角色换行分隔"></textarea>
                    </td>
                </tr>
                
                <tr>
                    <th class="th-label">邮件内容</th>
                    <td><textarea class="form-control" name="content" rows="5"></textarea></td>
                </tr>
                
                <tr>
                    <th class="th-label">金钱数量</th>
                    <td>
                    	元宝 x <input type="text" class="form-control inline" style="width: 50px;" name="" />
                    	&nbsp;&nbsp;&nbsp;
                    	绑定元宝 x <input type="text" class="form-control inline" style="width: 50px;" name="" />
                    </td>
                </tr>
                
                <tr class="attach-info" for="1">
                    <th class="th-label">道具</th>
                    <td>
                        <ul class="nav send-item-list">
                            <li>
                                <input name="" class="form-control inline" placeholder="名称" size="12"/>
                                <input type="text" name="" class="form-control inline" placeholder="数量" size="5" />
                                <input type="text" name="" class="form-control inline" placeholder="颜色" size="5" />
                                <select class="form-control inline">
                                	<option value="1">绑定</option>
                                	<option value="2">不绑定</option>
                                	<option value="3">使用后绑定</option>
                                </select>

                                <div class="box-tools inline">
                                    <a href="javascript:;" class="tools-btn tools-btn-add badge bg-green"><i class="fa fa-plus"></i></a>
                                    <a href="javascript:;" class="tools-btn btn-del badge bg-red"><i class="fa fa-minus"></i></a>
                                </div>
                            </li>                           
                        </ul>

                        
                    </td>
                </tr>

                

            </table>
        </div>

        <div class="box-footer">
            <a href="javascript:history.go(-1);" class="btn btn-default">返回</a>
            <button type="submit" id="sub" class="btn btn-default pull-right">保存</button>
        </div>
    </div>
</form>


<script>
    $(function(){
    	var cloneItem = $(".send-item-list li:first-child").clone();
    	
    	$(".tools-btn-add").live('click',function(){
            var li = $(this).closest('li');
            var oneClone = cloneItem.clone();
            oneClone.insertAfter(li);
            oneClone.find('.sel-item-list').chosen();
        });


        $(".btn-del").live('click',function(){
            if(!window.confirm('是否要删除该条数据?')) return true;
            var li = $(this).closest('li'),
                ul = li.closest('ul');

            if(ul.children('li').length > 1){
                li.remove();
            }else{
                li.find('select, input').val('').change();
            }
        });
    });
</script>